<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>

<body>

  <script type="text/javascript">
    /*
      基于Promise发送Ajax请求
    */
    function queryData(url) {
      var p = new Promise(function (resolve, reject) {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
          if (xhr.readyState != 4) return;
          if (xhr.readyState == 4 && xhr.status == 200) {
            // 处理正常的情况
            // 异步
            resolve(xhr.responseText);
          } else {
            // 处理异常情况
            reject('服务器错误');
          }
        };
        xhr.open('get', url);
        xhr.send(null);
      });
      return p;
    }
    // 发送多个ajax请求并且保证顺序
    queryData('http://localhost:3000/data')
      .then(function (data) {
        console.log(data)
        return queryData('http://localhost:3000/data1');
      })
      .then(function (data) {
        console.log(data);
        return queryData('http://localhost:3000/data2');
      })
      .then(function (data) {
        console.log(data)
      });
  </script>
</body>

</html>